<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no,minimal-ui">
<meta content="${content.tagStr!}" http-equiv="keywords" />
<meta content="${content.description!}" http-equiv="description" />
<title>${site.name} - Powered by JavaCMS</title>
<link rel="stylesheet" type="text/css" href="/${mobileRes!}/css/index.css"> 
<link rel="stylesheet" type="text/css" href="/${mobileRes!}/css/pic.css">
<link href="${resSys}/jqueryUI/jquery.ui.css" rel="stylesheet" type="text/css"/>
<script src="${resSys}/jquery.js" type="text/javascript"></script>
<script src="${resSys}/jqueryUI/jquery-ui.js" type="text/javascript"></script>
<script src="${resSys}/front.js" type="text/javascript"></script>
<script src="/${mobileRes!}/js/hhSwipe.js" ></script>

<script type="text/javascript">
$(function() {
Cms.attachment("${base}","${content.id}","${content.attachments?size}","attach");
Cms.collectCsi("${base}","collectCsiDiv","collect_csi","${content.id}");
Cms.viewCount("${base}","${content.id}");
Cms.siteFlow("${base}", location.href, document.referrer,"${site.config.flowSwitch?string}");
});
function return_prepage()  
{  
if(window.document.referrer==""||window.document.referrer==window.location.href)  
{  
window.location.href="{dede:type}[field:typelink /]{/dede:type}";  
}else  
{  
window.location.href=window.document.referrer;  
}  
  
}  
</script>

<!--[if lt IE 9]> 
<script src="/${res}/js/html5shiv.min.js"></script>
<script src="/${res}/js/respond.min.js"></script>
<![endif]-->

</head>

<body>
<div class="viewport">
  <header class="header-pic">
    <div class="back"><a href="javascript:return_prepage();"></a></div>
    <div class="header-pic-r fr"><a class="pic-share" onClick="toshare()"></a></div>
    <div class="am-share">
         <div style="padding:20px 16px 16px 16px;"> 
        <ul class="am-share-sns" class="bdsharebuttonbox">
        <li><a href="javascript:window.open('http://v.t.sina.com.cn/share/share.php?title='+encodeURIComponent(document.title.substring(0,76))+'&url='+encodeURIComponent(location.href)+'&rcontent=','_blank','scrollbars=no,width=320,height=450,left=0,top=20,status=no,resizable=yes'); void 0"> <i class="share-icon-sina"></i><span>新浪微博</span></a> </li>
        <li><a data-cmd="weixin"> <i class="share-icon-weixin"></i><span>微信</span></a> </li>
        <li><a onclick="window.open('http://connect.qq.com/widget/shareqq/index.html?url='+encodeURIComponent(document.location.href));return false;"> <i class="share-icon-qq"></i><span>QQ</span></a> </li>
        <li><a onclick="window.open('http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url='+encodeURIComponent(document.location.href));return false;"> <i class="share-icon-qqzone"></i><span>QQ空间</span></a> </li>
        </ul>
          </div>
      </div>
      <script type="text/javascript">
		function toshare(){
			$(".am-share").addClass("am-modal-active");	
			if($(".sharebg").length>0){
				$(".sharebg").addClass("sharebg-active");
			}else{
				$("body").append('<div class="sharebg"></div>');
				$(".sharebg").addClass("sharebg-active");
			}
			$(".sharebg-active").click(function(){
				$(".am-share").removeClass("am-modal-active");	
				setTimeout(function(){
					$(".sharebg-active").removeClass("sharebg-active");	
					$(".sharebg").remove();	
				},300);
			})
		}	
	  </script>
       
  </header>
  <div class="addWrap" style="background-color:#f0f0f0;">
	<div class="swipe" id="mySwipe" style="width:100%; height:100%;">
		<div class="swipe-wrap" style="width:100%; height:100%;">
                      [#list content.pictures as p]
			<div style="display:-webkit-box;-webkit-box-pack:center;-webkit-box-align:center; width:100%; height:100%;">
                          <a href="javascript:;">
                            <img class="img-responsive" src="${p.imgPath!}"/>
                            <div class="slBanrTxt pic-sl"><p>${p.description!}</p></div>
                          </a>
                        </div>
			[/#list]
		</div>
	</div>	
	<ul id="position">
       [#list content.pictures as p]
      <li [#if p_index<1]class="cur"[/#if]>${p_index+1}</li>
	[/#list]
      <span>/${content.pictures?size}</span>
	</ul>   
  </div>
  <script>
  $(function(){
	 var winHeight = $(window).height();
	$(".addWrap").css({height:winHeight});  
	  })  
  </script>
  <script type="text/javascript">
	var bullets = document.getElementById('position').getElementsByTagName('li');	
	var banner = Swipe(document.getElementById('mySwipe'), {
		auto:false,
		continuous: true,
		disableScroll:false,
		callback: function(pos) {
			var i = bullets.length;
			while (i--) {
				bullets[i].className = ' ';
			}
			bullets[pos].className = 'cur';

		}
	})
  </script>
  <footer class="pic-footer">[#if channel.allowUpdown]<a class="pic-zan" onclick="Cms.up('${base}',${content.id},${content.ups});"><span id="ups"></span></a>[/#if]<a href="${base}/comment.jspx?contentId=${content.id}" class="pic-comment">${content.commentsCheckedNum!}</a></footer>
</div>
</body>
</html>